<!--
  * 重置密码确认弹窗
  *
  * @Author:    1
  * @Date:      2024-03-21
-->
<template>
  <a-modal title="确认提示" :open="visibleFlag" @cancel="onClose" :maskClosable="false" :destroyOnClose="true" :width="400">
    <div class="confirm-content">
      <span class="confirm-icon">
        <QuestionCircleOutlined style="color: #faad14; font-size: 22px" />
      </span>
      <div class="confirm-message">
        <div>是否允许重置密码</div>
        <div class="confirm-desc">是否重置密码，重置后请及时修改密码，该操作不可逆，请确认！</div>
      </div>
    </div>

    <template #footer>
      <a-space>
        <a-button @click="onClose">取消</a-button>
        <a-button type="primary" :loading="loading" @click="handleConfirm">确定</a-button>
      </a-space>
    </template>
  </a-modal>
</template>

<script setup>
  import { ref } from 'vue'
  import { message } from 'ant-design-vue'
  import { QuestionCircleOutlined } from '@ant-design/icons-vue'
  import { smartSentry } from '/src/lib/smart-sentry'
  // import { userApi } from '/@/api/system/user-api';

  // 定义 props
  const props = defineProps({
    apiFunction: {
      type: Function,
      required: true,
    },
  })

  const emits = defineEmits(['success'])
  const visibleFlag = ref(false)
  const loading = ref(false)
  const currentRecord = ref(null)

  // 显示弹窗
  function show(record) {
    currentRecord.value = record
    visibleFlag.value = true
  }

  // 关闭弹窗
  function onClose() {
    visibleFlag.value = false
    currentRecord.value = null
  }
  // //重置密码
  // function resetPwd() {
  //   // 生成六位相同的随机数
  //   const generateRandomNumber = () => {
  //     const digit = Math.floor(Math.random() * 9)+1; // 随机生成一个 0 到 9 的数字
  //     // 将该数字重复六次
  //     return String(digit).repeat(6); // 返回生成的六位相同随机数
  //   };

  //   // 调用生成随机数的方法并返回
  //   return generateRandomNumber();
  // }

  let messageTimer = null
  let currentMessageKey = null

  function showMessage(content, duration) {
    // 清除之前的定时器和消息
    if (messageTimer) {
      clearTimeout(messageTimer)
    }
    if (currentMessageKey) {
      message.destroy(currentMessageKey)
    }
    // 生成一个新的消息 key
    currentMessageKey = `resetPasswordMessage-${Date.now()}`

    // 显示消息（禁用自动关闭）
    message.success({
      content: content,
      duration: undefined, // 禁用自动关闭
      key: currentMessageKey, // 确保消息唯一
      onClose: () => {
        // 消息关闭时清除定时器
        if (messageTimer) {
          clearTimeout(messageTimer)
          messageTimer = null
        }
      },
    })

    // 手动设置显示时间
    messageTimer = setTimeout(() => {
      message.destroy(currentMessageKey) // 关闭消息
      messageTimer = null
      currentMessageKey = null
    }, duration * 1000)
  }

  // 确认重置密码
  async function handleConfirm() {
    loading.value = true
    try {
      // 检查 apiFunction 是否存在
      if (typeof props.apiFunction !== 'function') {
        message.error('API  函数未正确配置')
        return
      }
      const params = {
        ...currentRecord.value,
      }
      const queryResult = await props.apiFunction(params)
      if (queryResult.code !== 200) {
        message.error(queryResult.msg)
        return
      }
      showMessage(`密码重置成功！`, 5)
      // const newPwd = queryResult.data.pwd
      // 显示成功消息并设置显示时间
      // showMessage(`密码重置成功, 新密码为：${newPwd}`, 5)
      emits('success')
      onClose()
    } catch (error) {
      smartSentry.captureError(error)
      message.error('密码重置失败')
    } finally {
      loading.value = false
    }
  }

  defineExpose({
    show,
  })
</script>

<style scoped>
  .confirm-content {
    display: flex;
    align-items: flex-start;
    padding: 20px 0;
  }

  .confirm-icon {
    margin-right: 16px;
    margin-top: 2px;
  }

  .confirm-message {
    flex: 1;
  }

  .confirm-desc {
    margin-top: 8px;
    color: rgba(0, 0, 0, 0.45);
    font-size: 14px;
  }
</style>
